<!-- <link rel="stylesheet" href="css/bootstrap.min.css"> -->
<link rel="stylesheet" href="css/default.css">
<div class="mark-b d-n" id="md_waiting">
    <div class="loading-all">
        <img src="./images/loadingC.gif" alt="">
        <div class="p16 c-text-w fs16 d-n" id="fsUploadProgress">
            <div class="pb4">
                <span>图片大小：</span>
                <span ng-bind="upload_size">{{upload_size}}</span>
                <span>kb</span>
            </div>
            <div class="pb4">
                <span>已上传：</span>
                <span ng-bind="upload_ed">{{upload_ed}}</span>
                <span>kb</span>
            </div>
            <div class="pb4">
                <span>上传速率：</span>
                <span ng-bind="upload_byte">{{upload_byte}}</span>
                <span>kb/s</span>
            </div>
            <div class="pb4">
                <span>上传进度：</span>
                <span ng-bind="upload_pc" id="upload_pc" ng-model="upload_pc">{{upload_pc}}</span>
                <span>%</span>
            </div>
        </div>
    </div>
</div>
<form class="inline_hack mt24 box" id="main_box">
    <div class="va-t box pos-r">
        <div class="pos-r z1">
            <div class="flex-box">
                <input id="md_category" type="text" class="input-normal flex1 bg-w" placeholder="请填写作物种类" autofocus required oninvalid="setCustomValidity('不能为空喔')" oninput="setCustomValidity('')">
            </div>
            <!-- <div class="flex-box">
                <input id="md_title" type="text" class="input-normal flex1" placeholder="请为文档命名标题" required oninvalid="setCustomValidity('标题不能为空喔')" oninput="setCustomValidity('')">
            </div> -->
            <div id="md_tool">
                <div class=" bg-tran ta-r">
                    <button class="btn bg-grey mr8" ng-click="back()" type="button">返回</button>
                    <button class="btn bg-cyan mr8" id="full_screen_toggle" type="button">全屏</button>
                    <!-- -------------------------------------input_file--------------------------- -->
                    <!-- <div class="fileup-container mr8">
                        <div class="fileup">
                            <label for="input_file_icon" class="fileup-in btn bg-cyan">为主题选择icon</label>
                            <input type="file" id="input_file_icon">
                        </div>
                    </div> -->
                    <div class="d-il mr8" id="btn-uploader">
                        <div class="d-il va-b lh0 img-box" id="cover_box"></div>
                        <button class="btn bg-cyan mr8" id="cover_pickfiles">封面图片</button>
                        <div class="d-il va-b lh0 img-box" id="icon_box"></div>
                        <button class="btn bg-cyan" id="icon_pickfiles">选择icon</button>
                    </div>
                    <!-- <button class="btn bg-grey mr8">查看上传过的图片</button> -->
                    <!-- <button class="btn bg-cyan mr8">保存</button> -->
                    <input type="submit" class="btn bg-green" value="发布 / 更新">
                </div>
            </div>
        </div>
        <textarea id="text-input" class="p8 b-tran drop-box flex1 box" oninput="this.editor.update()" placeholder="Start edit markdown......" required oninvalid="setCustomValidity('写点东西吧骚年')" oninput="setCustomValidity('')"></textarea>
    </div>
    <div class="va-t bor-l b-tran box">
        <div id="preview" class="p8 bor-b b-tran bg-yellow-t dcss box"></div>
    </div>
</form>
<div class="plr16 pb16">
    <h4>Tips</h4>
    <ul>
        <li>![Alt text](/path/to/img.jpg "Optional title")</li>
        <li>[some_link](link)</li>
    </ul>
</div>
<style>
#main_box>div {
    position: relative;
    display: inline-block;
    width: 50%;
    height: 800px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    resize: none;
}

.full-screen{
    position: absolute;
    top: 0;
    left:0;
    width:100%;
    height:100%;
    margin:0 !important;
    z-index: 999;
}
.full-screen > div{
    height:100% !important;
}
.full-screen #text-input{
    position: absolute !important;
    top:0;
    height:100% !important;
    padding-top:96px;
    z-index: 0;
}

#text-input {
    width: 100%;
    height: 736px;
    resize: none;
}

#text-input:focus {
    outline: rgba(46, 204, 113, 1) auto 5px;
}

#md_tool {}

.img-box>img {
    height: 28px;
    margin-right: 8px;
    border: solid 1px #fff;
}

#preview {
    overflow: auto;
    height: 100%;
}

.drop-box-t {
    color: rgba(52, 73, 94, 1);
}

#view>img {
    height: 144px;
}
</style>
